<template>
	<view>
		<button type="default" @click="login">提交</button>
		<button type="default" @click="tesk">task</button>
		<button type="default" @click="down">下载</button>
		<button type="default" @click="up">上传</button>
		<button type="default" @click="toask">toask</button>
		<button type="default" @click="loading">loading</button>
		<button type="default" @click="modole">弹出~确定取消</button>
		<!-- 导航分两种 声明式导航  编程式导航 -->
		<!-- 声明式导航 open-type="navigate" -->
		<navigator open-type="navigate" url="../TODoLIst/TODoLIst">todolisit</navigator>
		<navigator open-type="switchTab" url="../index/index">跳转tabber页面</navigator>
		
		<navigator url="../chp04/chp04?name=张三&age=20" open-type="navigate">传参</navigator>
		<button type="default" @click="mynav" size="mini">编程导航</button>
		<button type="default" @click="mytabber" size="mini">编程tabber</button>
	</view>

</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			mytabber(){
				uni.switchTab({
					url:'../index/index',
					success: () => {
						console.log('成功了')
					},
					fail: () => {
						console.log('失败了')
					}
				})
			},
			// 编程式导航
			mynav(){
				uni.navigateTo({
					url:'../TODoLIst/TODoLIst',
					success: () => {
						console.log('成功了')
					},
					fail: () => {
						console.log('失败了')
					}
				})
			},
			modole(){
				uni.showModal({
					title:'提示',
					content:'这是一个模拟弹窗',
					success: (res) => {
						if(res.confirm){
							console.log('确定')
						}else if(res.cancel){
							console.log('取消')
						}
						
					}
				})
			},
			
			toask(){
				uni.showToast({
					title:'弹窗',
					icon:'success'
				})
			},
			loading(){
				
				uni.showLoading({
					title:'正在登录!!!'
				})
				console.log('我在运行')
				// 模拟认为的手动关闭
				setTimeout(()=>{
					uni.hideLoading()
				},2000)
			},
			
			// uni.request已经做了promise,不可以写这样的

			async up() {
				const [, {
					data: token
				}] = await uni.getStorage({
					key: "token"
				});

				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						uni.uploadFile({
							url: 'http://127.0.0.1:8888/api/private/v1/upload', //仅为示例，非真实的接口地址
							header: {
								Authorization: token
							},
							filePath: tempFilePaths[0],
							name: 'file',
							success: (uploadFileRes) => {
								console.log(uploadFileRes.data);
							}
						});
					}
				});

			},
			tesk() {
				// 清除缓存建议重新再写一个方法
				uni.clearStorage()
			},
			async login() {
				// uni.request({
				// 	url:'http://127.0.0.1:8888/api/private/v1/login',
				// 	method:"POST",
				// 	data:{
				// 		usename:'admin',
				// 		password:'123456'
				// 	},
				// 	success: (res) => {
				// 		const {data:{data,meta}} = res;
				// 		uni.getStorage({
				// 			key:"token",
				// 			data:data.token,
				// 			success:()=>{
				// 				console.log('保存成功了')
				// 			}
				// 		})
				// 	}
				// });
				const [, {
					data: {
						data,
						meta
					}
				}] = await uni.request({
					url: 'http://127.0.0.1:8888/api/private/v1/login',
					data: {
						username: "admin",
						password: "123456"
					},
					method: "POST",
				})
				// 异步的方法 在html里边localstore,sessionstore
				// 小程序和uniapp里边都是用的setStorage来保存的
				uni.setStorage({
					key: "token",
					data: data.token,
					success: (data) => {
						console.log("存储成功")
					},
					fail: () => {
						console.log("存储失败")
					}
				})
				// console.log(data)
				// 同步的方法
				try {
					// 想知道有没有保存功能的话,需要去捕获异常
					// 数据量少,数据一多,就会导致程序卡顿或者是缓慢
					uni.setStorageSync('id', 10)
				} catch (err) {
					console.log(err)
				}
				// 清除缓存
				// uni.clearStorage()
			}
		}
	}
</script>

<style>

</style>
